<template>
    <sky-base-popup title="确认订单" ref="skyBasePopupRef">
        <view>
            <!--地址选择-->
            <addressSelect v-model="form.address_id"/>
            
            <!--商品信息-->
            <goodsCard :goodsInfo="goodsInfo"/>
            
            <view class="sky-row">
                <view>数量</view>
                <up-number-box v-model="form.goods_num" :max="goodsInfo.inventory"></up-number-box>
            </view>
            <view class="sky-row points">
                <view>积分
                    <text class="desc">2222可抵20元</text>
                </view>
                <up-checkbox
                        shape="circle"
                        name="agree"
                        usedAlone
                        v-model:checked="aloneChecked"
                >
                </up-checkbox>
            </view>
        
        
        </view>
        <template #footer>
            <up-button type="primary" shape="circle" color="#b07f63" text="立即购买" @tap="placeOrder"></up-button>
        </template>
    </sky-base-popup>
</template>
<script setup>
import addressSelect from './addressSelect.vue'
import goodsCard from './goodsCard.vue'


const emits=defineEmits(['success'])
const skyBasePopupRef = ref()
const value = ref(1)
const aloneChecked = ref(false)
const goodsInfo = ref({})

const form = ref({
    goods_id: '',
    address_id: '',
    deduct_money: 0, // 折扣金额
    goods_num: 1, //商品数量
    delivery_method: 2, //提货方式：1=自提，2=快递
})

const open = (data) => {
    form.value.goods_id = data.id
    goodsInfo.value = data
    skyBasePopupRef.value.open()
}

// 下单
const placeOrder = async () => {
    console.log('form', form.value)
    const res = await qly.api.order.placeOrder(form.value)
    if (res.code === 1) {
        emits('success')
        qly.dialog.toast({title: '下单成功'})
        skyBasePopupRef.value.close()
    } else {
        qly.dialog.apiError(res).catch()
    }
}
defineExpose({
    open
})
</script>
<style scoped lang="scss">
.sky-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12rpx 32rpx;
    
    .desc {
        font-size: 28rpx;
        color: #909193;
    }
}

.points {
    margin-bottom: 48rpx;
}
</style>
